import { FC } from "react";
import { View, Text, Image } from "@tarojs/components";
import { HIcon } from "@/components";
import Taro from "@tarojs/taro";
import styles from "./index.module.less";

const MyMatchmaker: FC = () => {
  const onCopy = () => {
    Taro.setClipboardData({
      data: "weixin001",
    });
  };
  return (
    <View className={styles["matchmaker-wrapper"]}>
      <View className={styles["header-wrapper"]}>
        <View className={styles["header-content"]}>
          <View className={styles["title"]}>
            私人专属红娘:脱单大娃(线上小红娘)
          </View>
          <View className={styles["hint"]}>
            添加专属红娘好友,获取红线,帮你牵线搭桥
          </View>
          <View className={styles["hint"]}>
            线下红娘服务,私人定制服务,全方位祝你脱单
          </View>
        </View>
      </View>
      <View className={styles["wechat-info"]}>
        <View>
          <HIcon type="weixin" size={34}></HIcon>
          <Text className={styles["text"]}>微信: weixin001</Text>
        </View>
        <Text className={styles["copy"]} onClick={onCopy}>
          立即复制
        </Text>
      </View>
      <View className={styles["code-wrapper"]}>
        <View className={styles["info-wrapper"]}>
          <Image
            className={styles["avator"]}
            mode="widthFix"
            src={require("@/assets/img/touxiang.png")}
          ></Image>
          <Text className={styles["name"]}>脱单大娃</Text>
        </View>
        <Image
          className={styles["code"]}
          mode="widthFix"
          src={require("@/assets/img/erweima.png")}
          showMenuByLongpress
        ></Image>
        <View className={styles["hint"]}>扫一扫上面的二维码图案,加我微信</View>
      </View>
    </View>
  );
};

export default MyMatchmaker;
